<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title>后代元素选择器</title>
		<style>
			
			
			div{
				width: 150px;
				height: 90px;
				line-height: 90px;
				border: 3px solid red;
				margin: 10px;
				text-align: center;
				font-family: "微软雅黑";
			}
			input[type=button]{
				background-color: #ef5b00;
				color: white;
				height: 30px;
				line-height: 30px;
				text-align: center;
				display: block;
				cursor: pointer;
				font-size: 12px;
				width: 250px;
				font-family: "微软雅黑";
				/*去掉边框的关键代码*/
				border: 0 none;
				
			}
			
			.b{
				border: 3px solid green;
				background-color: #ef5b00;
				color: white;
			}
		</style>
	</head>
	<body>
		
		<div>John Resig</div>
		<div>George Martin</div>
		<div>Malcom John </div>
		<div>Johnnn</div>
		
		<input type="button" onclick="search();" value="查找所有包含 John的 div 元素" />
	</body>
	
	<!--Step1:导入jquery-->
	<script type="text/javascript" src="../../../js/jquery-1.4.1.js" ></script>
	<script>
		function search(){
			var formInput = $("div:contains('John')");
			console.log(formInput.length);
			
			formInput.each(function(index,object){
				object.setAttribute("class","b");
				console.log(object.innerHTML);
			});
		}
	</script>
</html>

<!--
	作者：offline
	时间：2016-05-26
	描述：contains语法总结
	
	1：contains中不要忘记加上s
	2：前面记得有:
	3：包含的字符串放在()中间。如果外面是""。那么里面用''
	4: 匹配的字符串只要有就行 不管前面有什么 后面有什么
-->
